.clearfix() {
  &:before,
  &:after {
    content: " ";
    display: table;
  }
  &:after {
    clear: both;
  }
}

.text-variant(@bg-color, @name) {
  .text-@{name} {
    color: @bg-color;
  }
  .text-@{name}-lt {
    color: lighten(@bg-color, 5%);
  }
  .text-@{name}-lter {
    color: lighten(@bg-color, 10%);
  }
  .text-@{name}-dk {
    color: darken(@bg-color, 5%);
  }
  .text-@{name}-dker {
    color: darken(@bg-color, 10%);
  }

  a.text-@{name}:hover {
    color: darken(@bg-color, 10%);
  }
  a.text-@{name}-lt:hover {
    color: lighten(@bg-color, 10%);
  }
  a.text-@{name}-lter:hover {
    color: lighten(@bg-color, 20%);
  }
  a.text-@{name}-dk:hover {
    color: darken(@bg-color, 10%);
  }
  a.text-@{name}-dker:hover {
    color: darken(@bg-color, 20%);
  }
}

.setColor(@background:#fff,@text:#000,@border:transparent) {
  background-color: @background;
  color: @text;
  border-color: @border;
}

.shadow() {
  box-shadow: 0 1px 4px #bebebe;
}